<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>个人信息页|私教预约系统</title>
    <link href="../bootstrap-3.3.7-dist/css/bootstrap.min.css"  rel="stylesheet"  type="text/css" >
</head>

<body>

<h1 class="col-sm-offset-5 someFront"><span class="someFront">您的个人信息</span></h1>
<form class="form-horizontal someFront">
    <div class="form-group">

    </div>
    <div class="form-group">

    </div>

    <!--<div class="form-group">
        <label for="inputUserImage" class="col-sm-2 control-label">头像</label>
        <div class="col-sm-5">
            <img id="inputUserImage" alt="图片加载失败" title="点击更改头像" class="img-rounded"  style="width: 150px;height: 150px;" onclick="changeImage()">
        </div>
    </div>-->

    <div class="form-group">
        <label for="inputUserName" class="col-sm-2 control-label">姓名</label>
        <div class="col-sm-3">
            <input type="text" class="form-control" id="inputUserName" readonly="true" placeholder="姓名">
        </div>
    </div>

    <div class="form-group">
        <label for="inputUserNickName" class="col-sm-2 control-label">昵称</label>
        <div class="col-sm-3">
            <input type="text" class="form-control" id="inputUserNickName" placeholder="昵称">
        </div>
    </div>

    <div class="form-group">
        <label for="inputSex" class="col-sm-2 control-label">性别</label>
        <div class="col-sm-2">
            <select class = "selectpicker form-control" id = "inputSex"  title="请选择">
                <option value="1">保密</option>
                <option value="2">男</option>
                <option value="3">女</option>
            </select>
        </div>
    </div>


    <div class="form-group">
        <label for="inputAge" class="col-sm-2 control-label">年龄</label>
        <div class="col-sm-1">
            <input type="text" class="form-control" id="inputAge" placeholder="年龄">
        </div>
    </div>

    <div class="form-group">
        <label for="inputSignDate" class="col-sm-2 control-label">注册日期</label>
        <div class="col-sm-3">
            <input type="text" class="form-control" id="inputSignDate" readonly="true" placeholder="注册日期">
        </div>
    </div>


    <div class="form-group">
        <label for="inputBalance" class="col-sm-2 control-label">账户余额</label>
        <div class="col-sm-2">
            <input type="text" class="form-control" id="inputBalance" readonly="true" placeholder=" ">
        </div>
    </div>

    <div class="form-group">
        <label for="inputPhonenumber" class="col-sm-2 control-label">电话号码</label>
        <div class="col-sm-4">
            <input type="text" class="form-control" id="inputPhonenumber" placeholder="">
        </div>
    </div>

    <div class="form-group">
        <div class="col-sm-offset-2 col-sm-10">
            <button type="button" class="btn btn-info" onclick="saveEdition()">确认修改</button>
        </div>
    </div>
</form>
</body>


<script src="../jquery/jquery-3.4.1.min.js"></script>
<script src="../bootstrap-3.3.7-dist/js/bootstrap.min.js"></script>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script src="https://cdn.staticfile.org/jquery-cookie/1.4.1/jquery.cookie.min.js"></script>
<script type="text/javascript">
    jQuery(document).ready(function(){

        let currentUserId = $.cookie("userid");

        jQuery.post("/getUserInfoById", {"userId": currentUserId}, function(rst) {

            //头像
            let imagePath = rst.userImage;
            $("#inputUserPhone").attr('src',imagePath);

            $("#inputUserName").val(rst.userName);

            $("#inputUserNickName").val(rst.userNickname);

            let sexId = 1;
            if (rst.userSex === "男")
            {
                sexId = 2;
            }else if (rst.userSex === '女'){
                sexId = 3;
            }

            $("#inputSex").val(sexId);

            $("#inputSignDate").val(rst.userSignDate);

            $("#inputAge").val(rst.userAge);

            $("#inputBalance").val(rst.userAccountBalance);

            $("#inputPhonenumber").val(rst.userPhone);

            })
    });

    function saveEdition(){

        let currentUserId = $.cookie("userid");

        let nickName = jQuery("#inputUserNickName").val();
        let options = $("#inputSex option:selected");
        let sexId = options.val();
        let sex = options.text();
        let age = jQuery("#inputAge").val();
        let phone = jQuery("#inputPhonenumber").val();

        jQuery.post("/editUserInfo", {"userNickname": nickName, "userSex": sex, "userAge": age, "userPhone": phone, "userId": currentUserId}, function(rst) {
            alert(rst);
            if(rst=="修改成功")
            {
                window.location.reload();
            }
        })
    }

    function changeImage(){
        window.location.href="userChangeImage.html";
    }
</script>


</html>
<style type="text/css">
    .someFront{
        color: rgb(250,98,15);
    }
    .someFront1{
        font-family: 微软雅黑, "Microsoft YaHei";
        font-size: 20px;
        color: rgb(250,98,15);
        border:none;
    }
</style>